.wallet-balance {
    padding: 20rpx;
    background-color: #F2F3F8;
    min-height: 100vh;

    .content {
        // 移除原有的背景色和内边距，由模块自身定义
        margin-bottom: 20rpx;

        // 通用模块样式
        .module {
            background-color: #fff;
            padding: 30rpx;
            margin-bottom: 24rpx;
        }

        // 模块一：余额信息模块
        .balance-module {
            background-color: #FFFFFF;
            border-radius: 26rpx;

            .balance-section {
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-bottom: 30rpx;


                wx-button {
                    margin-left: 0;
                    margin-right: 0;
                    border: none;
                    outline: none;
                    box-shadow: none;
                }

                .blance-header {
                    .balance-label {
                        font-family: Source Han Sans CN;
                        font-weight: 400;
                        font-size: 26rpx;
                        color: #888B9A;
                    }

                    .balance-amount {
                        font-family: Source Han Sans CN;
                        font-weight: 500;
                        font-size: 58rpx;
                        color: #0E1C37;
                    }

                }



                .withdraw-button {
                    width: 192rpx;
                    height: 66rpx;
                    background: #BEFF32;
                    border-radius: 33rpx;
                    line-height: 65rpx;
                    text-align: center;
                    font-family: Source Han Sans CN;
                    font-weight: 500;
                    font-size: 32rpx;
                    color: #0E1C37;
                    border: none;
                    outline: none;
                    box-shadow: none;
                }
            }

            .info-section {
                display: flex;
                justify-content: space-between;
                border-top: 1rpx solid #EEF2F3;

                .info-item {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    width: 48%;
                    // padding: 25rpx;
                    margin: 30rpx;
                    margin-bottom: 10rpx;
                    margin-right: 20rpx;
                    // border-radius: 12rpx;

                    .info-label {
                        font-size: 26rpx;
                        color: #666;
                        margin-bottom: 10rpx;
                    }

                    .info-value {
                        font-size: 32rpx;
                        font-weight: bold;
                        color: #333;
                    }
                }

                .info-item:first-child {
                    border-right: 1rpx solid #EEF2F3;
                }
            }
        }

        // 模块二：余额明细模块
        .detail-module {
            background-color: #FFFFFF;
            border-radius: 35rpx;

            .detail-section {


                .detail-title {
                    font-family: Source Han Sans CN;
                    font-weight: bold;
                    font-size: 32rpx;
                    color: #0E1C37;
                    margin-bottom: 20rpx;
                }

                .detail-item {
                    display: flex;
                    justify-content: space-between;
                    // padding: 25rpx;
                    // background-color: #f9f9f9;
                    border-radius: 12rpx;

                    .detail-time {
                        font-size: 28rpx;
                        color: #333;
                    }

                    .detail-amount-header {
                        display: flex;
                        align-items: center;

                        .detail-amount {
                            font-weight: 400;
                            font-size: 26rpx;
                            color: #888B9A;
                            margin-right: 10rpx;
                        }
                    }

                }
            }
        }

        // 模块三：借钱模块
        .borrow-module {
            border-radius: 35rpx;

            .borrow-section {
                .borrow-title {
                    font-size: 32rpx;
                    font-weight: bold;
                    color: #333;
                    margin-bottom: 20rpx;
                }

                .borrow-amount {
                    font-size: 48rpx;
                    font-weight: bold;
                    color: #333;
                    margin-bottom: 20rpx;
                }

                .borrow-button {
                    width: 160rpx;
                    height: 70rpx;
                    line-height: 70rpx;
                    text-align: center;
                    background-color: #ff7d00;
                    color: #fff;
                    border-radius: 35rpx;
                    font-size: 28rpx;
                    border: none;
                    outline: none;
                    box-shadow: none;
                }
            }
        }
    }

    /* 弹窗样式 */
    .modal-content {
        width: 638rpx;
        height: 360rpx;
        background: #FFFFFF;
        border-radius: 35rpx;
        padding: 30rpx;

        .modal-title {
            font-family: Source Han Sans CN;
            font-weight: bold;
            font-size: 32rpx;
            color: #0E1C37;
            margin: 0 auto;
            margin-top: 20rpx;
            margin-bottom: 40rpx;
            text-align: center;
        }

        .modal-desc {
            width: 529rpx;
            height: 72rpx;
            font-family: Source Han Sans CN;
            font-weight: 400;
            font-size: 26rpx;
            color: #0E1C37;
            margin: 0 auto;
            margin-bottom: 100rpx;
            text-align: center;
            line-height: 1.5;
        }

        .modal-buttons {
            display: flex;
            justify-content: space-between;

            .button {
                width: 48%;
                height: 80rpx;
                line-height: 80rpx;
                text-align: center;
                border-radius: 12rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
                font-size: 32rpx;
                color: #0E1C37;
                border: none;
                outline: none;
                box-shadow: none;
            }

            .cancel {
                width: 244rpx;
                height: 83rpx;
                background: #D0D4D7;
                border-radius: 12rpx;
                margin-right: 20rpx;
            }

            .confirm {
                width: 382rpx;
                height: 83rpx;
                background: #BEFF32;
                border-radius: 12rpx;
            }
        }
    }

    .withdraw-content {
        padding: 30rpx;
        background-color: #FFFFFF;
        border-radius: 35rpx 35rpx 0rpx 0rpx;
        padding-top: 87rpx;

        .withdraw-title {
            font-size: 32rpx;
            font-weight: bold;
            color: #333;
            margin-bottom: 79rpx;
            // text-align: center;
        }

        .amount-input-container {
            display: flex;
            align-items: center;
            justify-content: start;
            margin-bottom: 30rpx;
            border-bottom: 1rpx solid #A3A6B7;
            padding-bottom: 32rpx;

            .amount-symbol {
                font-weight: 500;
                font-size: 36rpx;
                color: #0E1C37;
                line-height: 26rpx;
                margin-right: 10rpx;
            }

            .amount-input {
                display: block;
                width: 600rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
                font-size: 58rpx;
                color: #0E1C37;
                line-height: 30rpx;
                padding-bottom: 5rpx;
            }
        }

        .withdraw-desc {
            font-family: Source Han Sans CN;
            font-weight: 400;
            font-size: 26rpx;
            color: #A3A6B7;
            line-height: 26rpx;
            margin-top: 15rpx;
            margin-bottom: 90rpx;

            .withdraw-all {
                font-family: Source Han Sans CN;
                font-weight: 400;
                font-size: 26rpx;
                color: #5894F6;
                line-height: 26rpx;
                margin-left: 15rpx;
                // text-decoration: underline;
            }
        }

        .payment-methods {
            margin-bottom: 60rpx;

            .payment-method {
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 25rpx;
                background-color: #f9f9f9;
                border-radius: 12rpx;
                margin-bottom: 20rpx;


                .payment-icon {
                    width: 50rpx;
                    height: 50rpx;
                    margin-right: 20rpx;
                }

                text:first-of-type {
                    flex: 1;
                    font-size: 30rpx;
                    color: #333;
                }

                .bind-link {
                    color: #007aff;
                    font-size: 28rpx;
                    margin-right: 20rpx;
                }

                // 新增勾选框样式
                .checkbox {
                    width: 36rpx;
                    height: 36rpx;
                    border-radius: 50%;
                    border: 2rpx solid #ddd;
                    display: flex;
                    align-items: center;
                    justify-content: center;

                    .checkbox-icon {
                        width: 24rpx;
                        height: 24rpx;
                    }
                }

                // .checkbox.checked {
                //     border-color: #4cd964;
                //     background-color: #4cd964;
                // }
            }
        }

        // 修改确认按钮样式
        .confirm-button {
            width: 100%;
            height: 90rpx;
            line-height: 90rpx;
            text-align: center;
            color: #888B9A;
            border-radius: 12rpx;
            margin-bottom: 20rpx;
            font-size: 32rpx;
            border: none;
            outline: none;
            box-shadow: none;
            // 移除固定背景色，由active/disabled类控制
        }


        // 激活状态 - 绿色
        .confirm-button.active {
            background-color: #BEFF33;
            color: #0E1C37;
        }

        // 禁用状态 - 灰色
        .confirm-button.disabled {
            background-color: #D0D4D7;
            color: #888B9A;
            cursor: not-allowed;
        }

        .cancel-button {
            width: 100%;
            height: 90rpx;
            line-height: 90rpx;
            text-align: center;
            color: #979797;
            font-size: 32rpx;
            border: none;
            outline: none;
            box-shadow: none;
        }

        button {
            background-color: #ffffff;
            border: none;
        }

    }

    .password-content {
        padding: 30rpx;
        background: #FFFFFF;
        border-radius: 35rpx 35rpx 0rpx 0rpx;
        position: relative;

        .password-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 20rpx;
            position: relative;
        }

        .password-title {
            font-family: Source Han Sans CN;
            font-weight: bold;
            font-size: 32rpx;
            color: #0E1C37;
            margin-top: 20rpx;
        }



        .password-amount {
            margin-top: 70rpx;
            display: block;
            width: 698rpx;
            height: 80rpx;
            font-family: Source Han Sans CN;
            font-weight: 500;
            font-size: 58rpx;
            color: #0E1C37;
            line-height: 26rpx;
            margin-bottom: 30rpx;
            text-align: center;
            border-bottom: 1rpx solid #EEF2F3;
        }

        .password-fees {
            margin-bottom: 30rpx;
            padding: 0 20rpx;

            .fee-item {
                display: flex;
                justify-content: space-between;
                align-items: center;
                font-family: Source Han Sans CN;
                font-weight: 400;
                font-size: 22rpx;
                color: #888B9A;
                margin-bottom: 10rpx;
            }
        }

        .password-input {
            .password-dots {
                display: flex;
                justify-content: center;
                margin-bottom: 60rpx;

                .dot-container {
                    width: 66rpx;
                    height: 66rpx;
                    background-color: #D0D4D7;
                    border-radius: 10rpx;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin: 0 10rpx;
                }

                .dot {
                    width: 18rpx;
                    height: 18rpx;
                    border-radius: 50%;
                    background-color: transparent;
                }

                .dot.active {
                    background-color: #0E1C37;
                    /* 黑色圆点 */
                }
            }
        }

        .number-pad {
            width: 100%;

            .number-row {
                display: flex;
                justify-content: space-between;
                border-top: 1px solid #D0D4D7;

                .number-button {
                    width: 250rpx;
                    height: 100rpx;
                    line-height: 110rpx;
                    text-align: center;
                    font-family: PingFang SC;
                    font-weight: bold;
                    font-size: 36rpx;
                    color: #0E1C37;
                    background-color: #FFFFFF;
                    border-right: 1px solid #D0D4D7;
                    outline: none;
                    box-shadow: none;

                    // 添加点击特效
                    &:active {
                        background-color: #e6e8e9;
                    }
                }

                .number-button:nth-child(3n) {
                    border-right: 0;
                }

                .number-button.confirm {
                    background: #D0D4D7;
                }

                .number-button.delete {
                    background: #D0D4D7;
                    color: #0E1C37;
                }
            }
        }


    }

    /* 错误提示弹窗样式 */
    .error-popup {
        width: 400rpx;
        height: 300rpx;
        background-color: #FFFFFF;
        border-radius: 20rpx;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .error-message {
        font-size: 32rpx;
        color: #333333;
        margin: 20rpx 0 10rpx;
    }

    .error-submessage {
        font-size: 28rpx;
        color: #666666;
    }

    .success-toast {
        width: 352rpx;
        height: 86rpx;
        background-color: #404040;
        // box-shadow: 0rpx 9rpx 13rpx 0rpx rgba(64,64,64,0.27);
        border-radius: 16rpx;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        color: #FFFFFF;
    }
}